<template>
  <div class="ticket">
    <div class="desc">
        <h2>台骀山滑世界 <span>5A</span></h2>
        <div class="score">
            <p><span>5.0</span>分</p>
            <p>59.1万+条点评</p>
        </div>
    </div>
    <div class="main">
        <div class="title">
            <h3>景区门票</h3>
            <button>预售上午场</button><button class="last">预售下午场</button>
        </div>
        <div class="policy">
            <p>优待政策：老人,学生,儿童,女性,残疾人,军人<span class="iconfont ">&#xe667;</span></p>
        </div>
        <div class="block" v-for="(item,key) in categoryList" :key="key">
            <h5>{{item.title}}</h5>
            <p class="price">￥{{item.price}}起<span class="iconfont">&#xe65a;</span></p>
        </div>
    </div>
    <div class="footer">
        <!-- <h3>用户评论</h3>
        <p>10023条评论</p>
        <p>查看全部</p> -->
    </div>
  </div>
</template>

<script>
export default {
  name: 'DetailHeader',
  props:{
      categoryList:Array
  },
  data(){
    return{
    
    }
  }
}
</script>

<style lang="stylus" scoped>
.ticket
    margin .2rem .1rem
    // background red
    .desc 
        border 1px solid #ececec
        border-radius .2rem
        background #fff
        height .8rem
        line-height .8rem
        padding .2rem .2rem
        position relative
        h2 
            font-size .36rem
            padding-left .2rem
            span 
                font-size .24rem
        .score
            position absolute
            top .24rem
            right .1rem
            font-size .24rem
            line-height .32rem
            direction rtl
            padding-right .2rem
    .main
        background #ffffff
        border-radius .2rem
        margin-top .2rem
        padding .3rem .2rem
        .title

            h3 
                font-size .36rem
            button 
                margin-top .2rem
                padding .16rem .16rem
                border-radius .2rem
                background #5ddaf1
                margin-right .2rem
                color #fff
        .policy
            background #efefef
            margin .2rem 0
            padding .1rem .1rem .1rem .2rem
            font-size .24rem
            span
                margin-left .1rem
                vertical-align middle
        .block 
            height .8rem
            line-height .8rem
            border-bottom 1px solid #efefef
            position relative
            h5 
                font-size .32rem
            .price
                position absolute
                top 0
                right 0
    .footer
        height 1rem   
</style>